<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>数据查询</title>
<link rel="stylesheet" type="text/css"
	href="../css/btn_class.css" />
<link rel="stylesheet" type="text/css"
	href="../ext-2.2/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="../ext-2.2/style.css" />
<script type="text/javascript"
	src="../ext-2.2/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext-2.2/ext-all.js"></script>
	<script type="text/javascript" src = "../FusionCharts/FusionCharts.js"></script>
	<script type="text/javascript" src = "../FusionCharts/FusionChartsExportComponent.js"></script>
	<script type="text/javascript" src="../js/datepicker/WdatePicker.js" defer="defer"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<script type="text/javascript">
  function reloadcode(){
                var verify = document.getElementById('code');
                verify.setAttribute('src','makeCertPic.jsp?it='+Math.random());
        }
</script>
<body>
	
</body>
<script type="text/javascript">
	Ext.BLANK_IMAGE_URL = "../ext-2.2/resources/images/default/s.gif";
	Ext.QuickTips.init();// 为组件提供提示信息功能，form的主要提示信息就是客户端验证的错误信息。
    Ext.form.Field.prototype.msgTarget='side'; 
	
	Ext.onReady(function() {
				Ext.QuickTips.init();
				
				Ext.override(Ext.form.RadioGroup, {     
				    getValue: function(){     
				        var v;     
				        if (this.rendered) {     
				            this.items.each(function(item){     
				                if (!item.getValue())      
				                    return true;     
				                v = item.getRawValue();     
				                return false;     
				            });     
				        }     
				        else {     
				            for (var k in this.items) {     
				                if (this.items[k].checked) {     
				                    v = this.items[k].inputValue;     
				                    break;     
				                }     
				            }     
				        }
				        return v;     
				    },     
				    setValue: function(v){     
				        if (this.rendered)      
				            this.items.each(function(item){     
				                item.setValue(item.getRawValue() == v);   
				            });     
				        else {     
				            for (var k in this.items) {     
				                this.items[k].checked = this.items[k].inputValue == v;     
				            }     
				        } 
				        
				    }     
				}); 
				
				var Jthtwb = Ext.data.Record.create([ {
					name : 'fpid',
					mapping : 'fpid',
					type : 'string'
				}, {
					name : 'fname',
					mapping : 'fname',
					type : 'string'
				}, {
					name : 'fstate',
					mapping : 'fstate',
					type : 'string'
				}, {
					name : 'fsex',
					mapping : 'fsex',
					type : 'string'
				}, {
					name : 'fphone1',
					mapping : 'fphone1',
					type : 'string'
				}, {
					name : 'fssy',
					mapping : 'fssy',
					type : 'string'
				}, {
					name : 'fszy',
					mapping : 'fszy',
					type : 'string'
				}, {
					name : 'fxl',
					mapping : 'fxl',
					type : 'string'
				}, {
					name : 'fxtnd',
					mapping : 'fxtnd',
					type : 'string'
				}, {
					name : 'fdate',
					mapping : 'fdate',
					type : 'string'
				}, {
					name : 'frdate',
					mapping : 'frdate',
					type : 'string'
				} ]);

				var ds = new Ext.data.Store({
					reader : new Ext.data.JsonReader({
						totalProperty : 'totalProperty',
						root : 'root'
					}, Jthtwb),
					idProperty : 'threadid',
					remoteSort : true,
					url : 'xyj!queryXyjRecord.do'
				});


				//定义勾选框，不需要可不必定义
				var sm = new Ext.grid.CheckboxSelectionModel({
					singleSelect : true //单选
				});

				//定义列
				var colM = new Ext.grid.ColumnModel([ 
				    {
						header : '数据接收日期',
						dataIndex : 'frdate',
						width : 100,
						renderer : function(value) {
								if (value == null || value == "null") {
									return "";
								} else {
									return value;
								}
							}
					}, {
						header : '收缩压',
						dataIndex : 'fssy',
						width : 100,
						renderer : function(value) {
								if (value == null || value == "null") {
									return "";
								} else {
									return value + " /mmHg";
								}
							}
					}, {
						header : '舒张压',
						dataIndex : 'fszy',
						width : 100,
						renderer : function(value) {
								if (value == null || value == "null") {
									return "";
								} else {
									return value + " /mmHg";
								}
							}
					}, {
						header : '心率',
						dataIndex : 'fxl',
						width : 100,
						renderer : function(value) {
								if (value == null || value == "null") {
									return "";
								} else {
									return value + " /min";
								}
							}
					} ]);

				
				//生成表格
				var grid = new Ext.grid.GridPanel({
					closable : false,
					region : 'center',
					height : 350,
					autoWidth : true,
					stripeRows : true,
					//title : '角色列表',
					cm : colM,
					ds : ds,
					sm : sm,
					listeners : {
						'rowdblclick' : function(grid, row) { //双击打开
							var record = grid.getSelectionModel().getSelected();
							if (record) {
								show_chart_fun(record.data.fphone1, record.data.fname);
							}
						}
					},
					bbar : new Ext.PagingToolbar({
				        pageSize: 50,
				        store: ds,
				        displayInfo: true,
				        displayMsg: '共 {2} 条',
				        emptyMsg: "没有记录"
				    })
				});
				
				var detailsPanel = {
					id: 'details-panel',
			        region: 'center',
			        bodyStyle: 'padding-bottom:15px;background:#FFFFFF;',
					autoScroll: true,
					html: '<table><tr><td id="chartdiv1"><img src="../images/xyjc_1.jpg" width=900 height=350 border=0><td/></tr><tr><td height="20"><td/></tr>'
					     +'<tr><td id="chartdiv2"><img src="../images/xtjc_0.jpg" width=900 height=350  border=0><td/></tr><tr><td height="20"><td/></tr>'
					     +'<tr><td id="chartdiv3"><img src="../images/xtjc_1.jpg" width=900 height=350  border=0><td/></tr><tr><td height="20"><td/></tr>'
					     +'<tr><td id="chartdiv4"><img src="../images/xtjc_2.jpg" width=900 height=350  border=0><td/></tr></table>'
			    };
			    
				var btn_close = new Ext.Button({
					text : '关闭',
					iconCls : 'sy-reset',
					handler : function() {
						chart_window.close();
					}
				});
				
				var panel_right = new Ext.Panel({
					region: "east",
					split:true,
		            minSize: 105,
		            maxSize: 500,
		            title : '历史数据',
		            collapsible: true,
		            collapsed: true, //展开或关闭
		            margins:'0 0 0 0',
		            layout:'fit',
		            layoutConfig:{
		                animate:true
		            },
					items :[ grid ],
					width:350
			   });
			   
			   
			   var chart_bdate = new Ext.form.TextField({
					fieldLabel : '开始日期',
					format: 'yyyy-MM-dd',
					id:'fbdate_id_chart',
					name:'fbdate',
					width : 90,
					style:"cursor:pointer;color:blue",
					listeners : {
						'focus' : function() {
							WdatePicker({startDate:'%y-%M-%d',dateFmt:'yyyy-MM-dd',alwaysUseStartDate:true});
						}
					}
				});
			
	           var chart_edate = new Ext.form.TextField({
	   				fieldLabel : '结束日期',
	   				format: 'yyyy-MM-dd',
	   				id:'fedate_id_chart',
					name:'fedate',
					width : 90,
					value : new Date().format('Y-m-d'),
	   				style:"cursor:pointer;color:blue",
	   				listeners : {
	   					'focus' : function() {
	   						WdatePicker({startDate:'%y-%M-%d',dateFmt:'yyyy-MM-dd',alwaysUseStartDate:true});
	   					}
	   				}
	   			});
	   			
	   			var fstate_radio = new Ext.form.RadioGroup({
			                       id:'ccgc_radio_id',
								   style:'width:100px; display: block;text-align:left;line-height:22px;',
								   height:20,
								   width:180,
			       				   fieldLabel : '标记状态',
			                       columns : 2,
			                       vertical :true,
			                       items:[
			                              {boxLabel:'近30次记录',inputValue:'30',name:'fstate', checked: true},
			                              {boxLabel:'近50次记录',inputValue:'50',name:'fstate'}
			                       ],
							       listeners : {
							        	'change' : function(rg, checked){
							        		fstate_radio.getEl().dom.readOnly = checked.getGroupValue() == 'yes' ? false : true;
								   }}
						    });
	   			
	   			var btn_search_chart = new Ext.Button({
					text : '查询',
					iconCls : 'sy-search',
					handler : function(btn) {
					
					if(Ext.get('fphone_id').dom.value == null) {
						Ext.Msg.alert('错误', '请输入手机号码！');     
						return "";
					}
					
					if(Ext.get('fkeywords_id').dom.value == null) {
						Ext.Msg.alert('错误', '验证码错误！');     
						return "";
					}
					
					document.getElementById("chartdiv1").innerHTML = "";
					document.getElementById("chartdiv2").innerHTML = "";	
					//血压曲线图
					Ext.Ajax.request({     
						url : 'xyj!produceXyjToChartByPerson.do',     
						method : 'POST',     
						params : {        
							'fphone1' : Ext.get('fphone_id').dom.value,   
							'fkeywords' : Ext.get('fkeywords_id').dom.value, 
							'fstate' : fstate_radio.getValue()  
							},     
						success : function(response, action) {        
							var myChart;        
							var responseText = response.responseText; 
							var pattern = new RegExp("^[\\s]+","gi");
        					var chart_data = responseText.replace(pattern,"");
							var myChart = new FusionCharts("../FusionCharts/MSLine.swf", "myChartId1", "900", "380", "0", "1");
							myChart.setDataXML(chart_data);
							myChart.render("chartdiv1");
						},     
						failure : function() {        
							// Ext.Msg.alert('错误', '服务器出现错误请稍后再试！');     
						}  
					});  
					
					
					//餐前血糖曲线图
					Ext.Ajax.request({     
						url : 'xty!produceXtndToChartByPerson.do',     
						method : 'POST',     
						params : {        
							'fphone1' : Ext.get('fphone_id').dom.value,   
							'fkeywords' : Ext.get('fkeywords_id').dom.value, 
							'fflag' : '0', //餐前血糖
							'fstate' : fstate_radio.getValue()  
							},     
						success : function(response, action) {        
							var myChart;        
							var responseText = response.responseText; 
							var pattern = new RegExp("^[\\s]+","gi");
        					var chart_data = responseText.replace(pattern,"");
							var myChart = new FusionCharts("../FusionCharts/MSLine.swf", "myChartId1", "900", "370", "0", "1");
							myChart.setDataXML(chart_data);
							myChart.render("chartdiv2");
						},     
						failure : function() {        
							// Ext.Msg.alert('错误', '服务器出现错误请稍后再试！');     
						}  
					});
					
					
					//餐后1小时血糖曲线图
					Ext.Ajax.request({     
						url : 'xty!produceXtndToChartByPerson.do',     
						method : 'POST',     
						params : {        
							'fphone1' : Ext.get('fphone_id').dom.value,   
							'fkeywords' : Ext.get('fkeywords_id').dom.value, 
							'fflag' : '1', //餐后一小时血糖
							'fstate' : fstate_radio.getValue()  
							},     
						success : function(response, action) {        
							var myChart;        
							var responseText = response.responseText; 
							var pattern = new RegExp("^[\\s]+","gi");
        					var chart_data = responseText.replace(pattern,"");
							var myChart = new FusionCharts("../FusionCharts/MSLine.swf", "myChartId1", "900", "370", "0", "1");
							myChart.setDataXML(chart_data);
							myChart.render("chartdiv3");
						},     
						failure : function() {        
							// Ext.Msg.alert('错误', '服务器出现错误请稍后再试！');     
						}  
					});
					
					
					//餐后2小时血糖曲线图
					Ext.Ajax.request({     
						url : 'xty!produceXtndToChartByPerson.do',     
						method : 'POST',     
						params : {        
							'fphone1' : Ext.get('fphone_id').dom.value,   
							'fkeywords' : Ext.get('fkeywords_id').dom.value, 
							'fflag' : '2', //餐后两小时血糖
							'fstate' : fstate_radio.getValue()  
							},     
						success : function(response, action) {        
							//重置验证码
							reloadcode();
							Ext.get('fkeywords_id').dom.value = "";
							
							var myChart;        
							var responseText = response.responseText; 
							var pattern = new RegExp("^[\\s]+","gi");
        					var chart_data = responseText.replace(pattern,"");
							var myChart = new FusionCharts("../FusionCharts/MSLine.swf", "myChartId1", "900", "370", "0", "1");
							myChart.setDataXML(chart_data);
							myChart.render("chartdiv4");
						},     
						failure : function() {        
							// Ext.Msg.alert('错误', '服务器出现错误请稍后再试！');     
						}  
					});
					
					}
				});
				
				
			    
			    var twoTbar = new Ext.Toolbar({
					items:[ '请输入手机号码：', {
						xtype : 'numberfield',
						fieldLabel : '关键字',
						id : 'fphone_id',
						style:'display: block;text-align:left;cursor:pointer;color:blue',
						name : 'fphone',
						minLengthText:'手机号码为11位',
						maxLengthText:'手机号码为11位',
						minLength:11,
						maxLength:11,
						width : 130
					}, '-', '请输入验证码：', {
						xtype : 'textfield',
						fieldLabel : '验证码',
						id : 'fkeywords_id',
						name : 'fkeywords',
						style:"cursor:pointer;color:blue",
						validator : function(thisText) { 
								var isLoginNameOK = true; 
		                        Ext.Ajax.request({  
		                                    url : 'patient!checkQueryKey.do',
		                                    method : 'post',  
		                                    params : {  
		                                        'fkeywords' : thisText  
		                                    },  
		                                    success : function(response, options) {  
		                                        if (response.responseText == 1) { 
		                                            isLoginNameOK = false; 
		                                            Ext.getCmp('fkeywords_id').clearInvalid(); 
		                                        } else { 
		                                        	isLoginNameOK = true; 
		                                        	Ext.getCmp('fkeywords_id').markInvalid('请检查验证码！');
                                        			// Ext.Msg.alert('错误', '验证码错误！');  
		                                        }  
		                                    }  
		                                });  
		                        return isLoginNameOK;//输入框失去焦点后，执行Ajax请求，但马上继续执行对是否valid的判断，这里先返回valid，默认验证成功，假如异步的请求返回后发现账号已注册，在改成invalid  markInvalid('账号已被使用');  
		  
		                    },
						width : 100
					}, '-', '<img src="makeCertPic.jsp" id="code" onclick="reloadcode()" style="cursor: pointer;" alt="看不清楚,换一张">',
					'-', fstate_radio,
					'-', btn_search_chart ]
			    });
					
			    var panel = new Ext.Panel({
			    	region: "center",
					layout:'fit',
					border : true,
					margins:'0 5 0 0',
					tbar : [ '<img src="../images/20152405.jpg" height="70" width="1366" border=0>' ],
					listeners : {
						'render' : function(){
							twoTbar.render(this.tbar); 
						}
				 	},
					items : [ detailsPanel]
				});
				
				
				var viewport = new Ext.Viewport({
					layout : 'border',
					items : [ panel ]
				});
				
			});
			
			
					
					
</script>


</html>